import React, { useEffect, useState, useRef } from 'react';
import { View, Button, Input, Text } from '@tarojs/components'
import './index.scss';
export default (props) => {
    const {
        onChange,
        require = true,
        label,
        desc,
        value = [],
        list = [],
        placeholder = '--',
        fieldNames = {},
        hasFlag,
        flagKey
    } = props;
    const { name = 'name', key = 'key' } = fieldNames
    const handleTag = (val) => {
        console.log(val)
        const keys = val[key]
        console.log(value, keys)
        if (value.includes(keys)) {
            return value.filter(c => { return c !== keys })
        }
        return [...value, keys]
    }
    return <View className='FormCondition_check_item'>
        <View className='FormCondition_check_label'>
            <View className='FormCondition_check_label'>{label}</View>
            <View className='FormCondition_check_desc'>{desc}</View>
        </View>
        <View className='FormCondition_check_list'>
            {list.map(val => {
                return <View onClick={() => {
                    onChange(handleTag(val))
                }} className={hasFlag ? val[flagKey] === '1' ? 'FormCondition_check_val FormCondition_check_valCheck' : 'FormCondition_check_val' : value.includes[val[key]] ? 'FormCondition_check_val FormCondition_check_valCheck' : 'FormCondition_check_val'}>
                    {val[name]}
                </View>
            })}

        </View>
    </View>
};
